<!doctype html>
<html lang="es">
	<head>
		<meta charset="utf-8">
	</head>
	<body class="container-fluid">
		<div id="mecajiaContacto" class="col-md-12 mecajiaContacto">
		<div class="tituloContacto">
			<h2>Contacto</h2>
		</div>

		<div class="col-md-8 col-md-offset-2 textoContacto">Si quieres saber mas sobre HazArte o estas interesado en
			alguna de nuestras piezas, contáctanos.
			
			Recuerda que todas nuestras obras son hechas a mano, así que las
			obras pueden personalizarse y pedirse por encargo, si deseas algo
			así, ¡Pregúntanos!
		</div><br>

		<!--<div class="col-md-8 col-md-offset-3 listaContacto"><span class="glyphicon glyphicon-phone-alt iconoContacto"></span> Fijo: 913512054-(España) / 8754321-(Chile)</div> -->
		<div class="col-md-8 col-md-offset-3 listaContacto"><span class="glyphicon glyphicon-earphone iconoContacto"></span> Movil: 669121870-(España) / 89754815-(Chile)</div>
		<div class="col-md-8 col-md-offset-3 listaContacto"><span class="glyphicon glyphicon-envelope iconoContacto"></span> Email: mecajia@gmail.com</div>
		<div class="col-md-8 col-md-offset-3 listaContacto"><span class="glyphicon glyphicon-hand-right iconoContacto"></span> Redes sociales:
			<img id="facebookContacto" class="logos" src="imagenes/logos/facebook.jpg" alt="Facebook logo" height="20" width="20" data-toggle="tooltip" data-placement="right" title="Facebook Mecajia"/>
			<img id="twitterContacto" class="logos" src="imagenes/logos/twitter.jpg" alt="Twitter logo" height="20" width="20" data-toggle="tooltip" data-placement="right" title="Twitter Mecajia"/>
			<img id="instagramContacto" class="logos" src="imagenes/logos/instagram.jpg" alt="Instagram logo" height="20" width="20" data-toggle="tooltip" data-placement="right" title="Instagram Mecajia"/>
			<img id="googlePlusContacto" class="logos" src="imagenes/logos/g+.png" alt="Google+ logo" height="20" width="20" data-toggle="tooltip" data-placement="right" title="Google+ Mecajia"/>
		</div>
				<div class="col-md-8 col-md-offset-3 despliegueFormContacto" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"><span class="glyphicon glyphicon-send iconoContacto"></span> Pulse aquí para enviarnos un correo!</div>
	    <p>
			<!-- <span class="alert alert-danger" id="msgContacto"></span> -->
			<!-- <span class="alert alert-success" id="envioCorrecto"></span> -->
		</p>
		
		<div id="collapseOne" class="panel-collapse collapse col-md-8 col-md-offset-2">
			<div class="panel-body">
				<form role="form" id="formContacto">
					<div class="form-group">
						<label for="nombreMail">Nombre y Apellido</label> <input type="text"
							class="form-control" id="nombreMail" placeholder="Nombre" maxlength="55" onblur="comprobarDatos($(this))">
					</div>
					<div class="form-group" data-toggle="tooltip"
						title="Formato de email">
						<label for="correoMail">Dirección de correo</label> <input
							type="email" class="form-control" id="correoMail"
							placeholder="Correo electrónico" maxlength="55" onblur="comprobarDatos($(this))">
					</div>
					<div class="form-group">
						<label for="textoMail">Mensaje</label>
						<textarea class="form-control textareaMail" rows="3" id="textoMail" onblur="comprobarDatos($(this))"></textarea>
					</div>
					<div class="checkbox">
						<label> <input type="checkbox" id="checkMail">
							&nbsp;&nbsp;¿Quieres recibir información de nuestras novedades?
						</label>
					</div>
					<div class="col-md-4 col-md-offset-4">
						<button id="enviarCorreo" type="submit" class="btn btnEnviarCorreo" onclick="enviarContacto()">Enviar Mensaje</button>
					</div>
				</form>
			</div>		
		</div>
    </div>
</body>
</html>


<script type="text/javascript">
	
	$(document).ready(function(){	
		$('#instagramContacto').tooltip();
		$('#twitterContacto').tooltip();
		$('#facebookContacto').tooltip();
		$('#googlePlusContacto').tooltip();
	});

</script>
